<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<!DOCTYPE html>
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<link rel="stylesheet"
	href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script type="text/javascript" src="../js/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="../js/axios.js"></script>
<script type="text/javascript" src="../js/qs.js"></script>
<script src="https://unpkg.com/vue-router/dist/vue-router.js"></script>
<style>
* {
	margin: 0;
	padding: 0;
}

.app {
	width:800px;
<<<<<<< HEAD
	height:380px;
}

.portlet-default {
	padding: 20px;
}

  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 200px;
    height:400px;
    line-height: 100px;
    text-align: center;
  }
  .avatar {
    width: 200px;
    height: 400px;
=======
}

.portlet-default {
	padding: 20px;
}

  .avatar-uploader .el-upload {
    border: 1px dashed #d9d9d9;
    border-radius: 6px;
    cursor: pointer;
    position: relative;
    overflow: hidden;
  }
  .avatar-uploader .el-upload:hover {
    border-color: #409EFF;
  }
  .avatar-uploader-icon {
    font-size: 28px;
    color: #8c939d;
    width: 200px;
    height: 200px;
    line-height: 100px;
    text-align: center;
  }
  .avatar {
    width: 200px;
    height: 200px;
>>>>>>> refs/remotes/origin/产品

    display: block;
  }
</style>
</head>
<body>
	<div id="app" class="app">
		<div class="portlet-heading portlet-default">
			<h4 class="modal-title text-dark" align="center">
				
			</h4>
			<hr class="border-t-a">
		<el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm" > 
			 	
		    <el-form-item label="请选择分配员工：" label-width="100px" prop="user">
				 <div style="float: left;" v-for="(user,i) in tableData">
				 <template>
                     <el-radio-group v-model="ruleForm.user">
                     <el-radio :label="user.use_id" v-bind:value="user.use_id">{{user.use_name}}&nbsp;&nbsp;</el-radio>
                    </el-radio-group>
                 </template>
				 </div>
			</el-form-item>
		    	    
		    <el-form-item> 
		       <el-button @click="resetForm('ruleForm')">重选</el-button> 
		       <el-button type="primary" @click="submitForm('ruleForm')">分配</el-button> 
		    </el-form-item> 
	    </el-form>
	    </div>
	</div>
	<script >
			var vm = new Vue({
				el: ".demo-ruleForm",
				data() {
					return {
						 tableData: [],
						ruleForm: {
							user: '',
							useid:'',
						},
					};
				},
				methods: {
					submitForm(formName) {
						//验证方法
						this.$refs[formName].validate((valid) => {
							if(valid) {
								var ax = "/alloc";
								//post提交数据
								axios.post(ax,
									//参数转换
									Qs.stringify(this.ruleForm, {
										arrayFormat: 'brackets'
									})
									
								).then(function(v) {
									alert(v);
			                        console.log(v);
									if(v.data==true){
										alert("分配成功");
									}else if(v.data==false){
										alert("分配失败，请查看是否领取数达到公海上限");
									}
									window.parent.location.replace("/gonghai");
								}).catch(function(e) {
									alert("出错了"+e);
								});

							} else {
								console.log('error submit!!');
								return false;
							}
						});
					},
					 handleChange(value) {
				        console.log(value);
				      },
					
					resetForm(formName) { 
						this.$refs[formName].resetFields();
					},
					handleSelect: function(it) {
						console.log(it)
					}
				},

				 mounted() {
					
					var iosnn=this;
					//post提交数据
					axios.post("/selectcustuser",
						//参数转换
						Qs.stringify(this.ruleForm, {
							arrayFormat: 'brackets'
						})		
					).then(function(v) {
						iosnn.tableData = v.data;
						
					}).catch(function(e) {
						alert("出错了aaa"+e);
						
					});
				}
				
			});
		</script>
</body>



</html>